// App.js
import React, {useState} from 'react';
import {Layout} from 'antd';
import AppHeader from "./components/app/AppHeader";
import AppMenu from "./components/app/AppMenu";
import AppContent from "./components/app/AppContent";
import {BrowserRouter} from "react-router-dom";
import Login from "./pages/login/Login";
import RippleEffect from "./components/common/RippleEffect";

function App() {
    const [collapsed, setCollapsed] = useState(false); // 管理侧边栏折叠状态

    return (
        <BrowserRouter>
            <RippleEffect/>
            {window.location.pathname === "/login" || window.location.pathname === "/" ?
                <Login/>
                :
                <Layout style={{height: "100vh", width: "100vw"}}>
                    <AppHeader/>
                    <Layout>
                        {/* 将折叠状态和切换函数传递给菜单组件 */}
                        <AppMenu
                            collapsed={collapsed}
                            toggleCollapsed={() => setCollapsed(!collapsed)}
                        />
                        {/* 将折叠状态传递给内容组件 */}
                        <AppContent collapsed={collapsed}/>
                    </Layout>
                </Layout>}
        </BrowserRouter>
    );
}

export default App;